<template>
  <el-dialog
      :title="!dataForm.prId ? '新增' : '修改'"
      :close-on-click-modal="false"
      :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
             label-width="80px">
      <el-form-item label="产品名称" prop="prProjectName">
        <el-input v-model="dataForm.prProjectName" placeholder="产品名称"></el-input>
      </el-form-item>
      <el-form-item label="产品型号" prop="prProducerModel">
        <el-input v-model="dataForm.prProducerModel" placeholder="产品型号"></el-input>
      </el-form-item>
      <el-form-item label="产品编码" prop="prProjectNumber">
        <el-input v-model="dataForm.prProjectNumber" placeholder="产品编码"></el-input>
      </el-form-item>
      <el-form-item label="产品类别" prop="prProjectType">
        <el-input v-model="dataForm.prProjectType" placeholder="产品类别"></el-input>
      </el-form-item>
      <el-form-item label="主销地区" prop="sellingArea">
        <el-input v-model="dataForm.sellingArea" placeholder="主销地区"></el-input>
      </el-form-item>
      <el-form-item label="是否有涵盖机型" prop="isCover">
        <el-radio v-model="dataForm.isCover" label="1">是</el-radio>
        <el-radio v-model="dataForm.isCover" label="0">否</el-radio>
      </el-form-item>
      <el-form-item v-if="dataForm.isCover==='1'">
        <div v-for="(cover, index) in dataForm.covers" :key="index">
          <el-row :gutter="20">
            <el-col :span="18" style="margin-left: -80px;">
              <el-form-item label="涵盖机名称" prop="name">
                <el-input v-model="cover.name" placeholder="涵盖机名称"></el-input>
              </el-form-item>
            </el-col>
            <el-row type="flex" justify="end">
              <el-col :span="10">
                <el-button type="primary" icon="el-icon-plus" circle @click="addCover"></el-button>
              </el-col>
              <el-col :span="10">
                <el-button type="danger" icon="el-icon-minus" circle @click="removeCover(index)"></el-button>
              </el-col>
            </el-row>
          </el-row>
        </div>
      </el-form-item>
      <el-form-item label="生产者" prop="producerId">
        <template>
          <el-select v-model="dataForm.producerId" placeholder="请选择">
            <el-option
                v-for="item in eoptions"
                :key="item.id"
                :label="item.name"
                :value="item.name">
            </el-option>
          </el-select>
        </template>
        <!--      <el-input v-model="dataForm.companyName" placeholder="企业名称"></el-input>-->
      </el-form-item>
      <el-form-item label="生产厂" prop="manufacturerId">
        <template>
          <el-select v-model="dataForm.manufacturerId" placeholder="请选择">
            <el-option
                v-for="item in eoptions"
                :key="item.id"
                :label="item.name"
                :value="item.name">
            </el-option>
          </el-select>
        </template>
        <!--      <el-input v-model="dataForm.companyName" placeholder="企业名称"></el-input>-->
      </el-form-item>
      <el-form-item label="生产量" prop="production">
        <el-input v-model="dataForm.production" placeholder="生产量"></el-input>
      </el-form-item>
      <el-form-item label="销售量" prop="salesVolume">
        <el-input v-model="dataForm.salesVolume" placeholder="销售量"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      visible: false,
      eoptions:[],
      dataForm: {
        prId: 0,
        prProjectName: '',
        prProducerModel: '',
        prProjectNumber: '',
        prProjectType: '',
        sellingArea: '',
        productExecutionText: '',
        availInspReportPath: '',
        productInnoDescReportPath: '',
        productionLicence: '',
        production: '',
        salesVolume: '',
        prCreated: '',
        updatedAt: '',
        isCover: '', // 默认设置为有涵盖机型
        covers: [{ name: '' }], // 初始化为一个包含一个空对象的数组
        producerId: '',
        manufacturerId: ''
      },
      dataRule: {
        prProjectName: [
          { required: true, message: '产品名称不能为空', trigger: 'blur' }
        ],
        prProducerModel: [
          { required: true, message: '产品型号不能为空', trigger: 'blur' }
        ],
        prProjectNumber: [
          { required: true, message: '产品编码不能为空', trigger: 'blur' }
        ],
        prProjectType: [
          { required: true, message: '产品类别不能为空', trigger: 'blur' }
        ],
        sellingArea: [
          { required: true, message: '主销地区不能为空', trigger: 'blur' }
        ],
        production: [
          { required: true, message: '生产量不能为空', trigger: 'blur' }
        ],
        salesVolume: [
          { required: true, message: '销售量不能为空', trigger: 'blur' }
        ],
      }
    }
  },
  mounted() {
    this.geteoptions()
  },
  methods: {
    geteoptions(){
      this.$http({
        url: this.$http.adornUrl('/reportapproval/entrepreneur/geteoptions'),
        method: 'get',
        data: this.$http.adornParams({})
      }).then((data) => {
        if (data && data.code === 0) {
          this.eoptions = data.entrepreneurList
        }else {
          this.$message.error(data.msg)
        }
      })
    },
    // getEntrepreneurInfo(){
    //   this.$http({
    //     url: this.$http.adornUrl(`/reportapproval/entrepreneur/getCompanyNameInfo/${this.dataForm.companyName}`),
    //     method: 'get',
    //     data: this.$http.adornParams({})
    //   }).then((data) => {
    //     if (data && data.code === 0) {
    //       this.dataForm.address = data.entrepreneur.address
    //       this.dataForm.contact = data.entrepreneur.linkman
    //       this.dataForm.phone = data.entrepreneur.linkphone
    //     }else {
    //       this.$message.error(data.msg)
    //     }
    //   })
    // },
    getProductNumber(){
      this.$http({
        url: this.$http.adornUrl('/reportapproval/product/getProjectNumber'),
        method: 'get',
        data: this.$http.adornParams({})
      }).then((data) => {
        if (data && data.code === 0) {
          this.options = data.productList
          // console.log(this.options)
        }else {
          this.$message.error(data.msg)
        }
      })
    },
    addCover() {
      this.dataForm.covers.push({ name: '' });
    },
    removeCover(index) {
      if (this.dataForm.covers.length === 1){
        this.$message({
          message: '至少保留一行',
          type: 'error',
          duration: 1500,
        })
      }else{
        this.dataForm.covers.splice(index, 1);
      }
    },
    init(id) {
      this.dataForm.prId = id || 0;
      this.visible = true;
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields();
        if (this.dataForm.prId) {
          this.$http({
            url: this.$http.adornUrl(`/reportapproval/product/info/${this.dataForm.prId}`),
            method: 'get',
            params: this.$http.adornParams()
          }).then(( data ) => {
            if (data && data.code === 0) {
              this.dataForm.prProjectName = data.product.prProjectName;
              this.dataForm.prProducerModel = data.product.prProducerModel;
              this.dataForm.prProjectNumber = data.product.prProjectNumber;
              this.dataForm.prProjectType = data.product.prProjectType;
              this.dataForm.sellingArea = data.product.sellingArea;
              this.dataForm.productExecutionText = data.product.productExecutionText;
              this.dataForm.availInspReportPath = data.product.availInspReportPath;
              this.dataForm.productInnoDescReportPath = data.product.productInnoDescReportPath;
              this.dataForm.productionLicence = data.product.productionLicence;
              this.dataForm.production = data.product.production;
              this.dataForm.salesVolume = data.product.salesVolume;
              this.dataForm.prCreated = data.product.prCreated;
              this.dataForm.updatedAt = data.product.updatedAt;
              this.dataForm.isCover = data.product.isCover;
              this.dataForm.producerId = data.product.producerId;
              this.dataForm.manufacturerId = data.product.manufacturerId;
              this.dataForm.covers = data.product.covers || [{ name: '' }];
            }
          })
        } else {
          // 如果没有 ID，则初始化为一个包含一个空对象的数组
          this.dataForm.covers = [{ name: '' }];
        }
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.$http({
            url: this.$http.adornUrl(`/reportapproval/product/${!this.dataForm.prId ? 'save' : 'update'}`),
            method: 'post',
            data: this.$http.adornData({
              'prId': this.dataForm.prId || undefined,
              'prProjectName': this.dataForm.prProjectName,
              'prProducerModel': this.dataForm.prProducerModel,
              'prProjectNumber': this.dataForm.prProjectNumber,
              'prProjectType': this.dataForm.prProjectType,
              'sellingArea': this.dataForm.sellingArea,
              'productExecutionText': this.dataForm.productExecutionText,
              'availInspReportPath': this.dataForm.availInspReportPath,
              'productInnoDescReportPath': this.dataForm.productInnoDescReportPath,
              'productionLicence': this.dataForm.productionLicence,
              'production': this.dataForm.production,
              'salesVolume': this.dataForm.salesVolume,
              'prCreated': this.dataForm.prCreated,
              'updatedAt': this.dataForm.updatedAt,
              'isCover': this.dataForm.isCover,
              'covers': this.dataForm.covers,
              'producerId': this.dataForm.producerId,
              'manufacturerId': this.dataForm.manufacturerId,
            })
          }).then(( data ) => {
            if (data && data.code === 0) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.visible = false;
                  this.$emit('refreshDataList');
                }
              })
            } else {
              this.$message.error(data.msg)
            }
          })
        }
      })
    }
  }
}
</script>

